<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>
pre, #log {
  position: absolute;
  top: 0;
  left: 200px;
}
iframe {
  width: 150px;
  height: 500px;
}
</style>
<iframe src="http://localhost:8080/intersection-observer/resources/iframe-with-fixed-position-element.html"></iframe>
<script>

function checkRect(actual, expected, description) {
  if (!expected.length)
    return;
  assert_equals(actual.left, expected[0], description + '.left');
  assert_equals(actual.right, expected[1], description + '.right');
  assert_equals(actual.top, expected[2], description + '.top');
  assert_equals(actual.bottom, expected[3], description + '.bottom');
}

async_test(t => {
  var iframe = document.querySelector("iframe");

  assert_equals(window.innerWidth, 800, "Window must be 800 pixels wide.");
  assert_equals(window.innerHeight, 600, "Window must be 600 pixels high.");

  // This window will receive a message from the iframe for each
  // IntersectionObserver notification. The child should only generate one,
  // which indicates that a fixed position element is correctly intersecting
  // the viewport.
  window.addEventListener("message", event => {
    t.step(() => {
      checkRect(event.data.intersectionRect, [25, 125, 100, 200], "Fixed position div intersects viewport")
    });
    t.done();
  });

  iframe.onload = t.step_func(function() {
    requestAnimationFrame(() => { iframe.contentWindow.postMessage("", "*") });
  });
}, "IntersectionObserver target in cross-origin iframe with fixed position reports viewport intersectino.");
</script>
